<template>
  <div>
    <my-list
    v-for="item in list"
    :key="item.id"
    :id="item.id"
    :pname="item.pname"
    :price="item.price"
    :info="item.info"
    @ap='app'
    ></my-list>
  </div>
</template>

<script>
import MyList from './components/MyList.vue'
export default {
  data (){
    return {
      list: [
          { id: 101, pname: '超级无敌棒棒糖', price: 15, info: '好吃，再来一根' },
          { id: 171, pname: '超级解渴水果茶', price: 80, info: '好甜，真好喝' },
          { id: 191, pname: '超级好吃大鸡腿', price: 60, info: '可口，下饭~' }
        ]
    }
  },
  methods: {
    app(id){
      const row = this.list.find(item => {
        return item.id === id
      })
      row.price--
    }
  },
  components: { MyList },

}
</script>

<style>
  
</style>